<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
	<title>相册详情-<?php echo $gallery->title ?></title>
	<link rel="stylesheet" type="text/css" href="<?php echo assets('css/style.css')?>">
</head>
<body>
  <div id="header">
    <div id="logo"><a href="<?php echo url('index') ?>" style="color: #fff;">Gallery</a></div>
      <ul>
        <li><a href="<?php echo url('gallery/addImg', ['id' => $_GET['id']])?>">添加图片</a></li>
        <li><a href="javascript:;"><?php echo $user->userName ?></a></li>
        <li><a href="<?php echo url('gallery/create') ?>">新建相册</a></li>
      </ul>
    </div>

    <div id="content">
      <div id="wrapper">
        <div>
          <a href="<?php echo url('index') ?>">首页</a>
          -
          <span><?php echo $gallery->title ?> - </span>
          <span><?php echo $gallery->description ?></span>
        </div>
        <ul>
          <?php foreach($gallery->imageCollection as $image) : ?>
          <li class="image" style="padding: 3px;">
            <img style="width: 300px; height: 290px;" src="<?php echo assets($image->path)?>" />
            <div style="width: 300px; height: 0px; top: -5px; overflow: hidden;">
              <a href="<?php echo url('image/edit', ['g' => $gallery->id, 'm' => $image->id])?>">编辑</a>
              <a href="<?php echo url('image/delete', ['g' => $gallery->id, 'm' => $image->id])?>">删除</a>
            </div>
          </li>
          <?php endforeach; ?>
        </ul>
      </div>
    </div>
<div id="footer">
   @copyright wanczy-php06 use for PHP OOP demo
</div>
<script type="text/javascript" src="<?php echo assets('js/jquery-1.11.3.min.js') ?>"></script>
<script type="text/javascript">
$('#wrapper ul li').on('mouseenter', function(e) {
  // li 元素的鼠标经过事件 
  $(e.delegateTarget).find('div').animate({
    height: '60px',
    top: '-65px'
  },150);
}).on('mouseleave', function(e) {
  $(e.delegateTarget).find('div').animate({
    height: '0',
    top: '-5'
  },150);
});
</script>
</body>
</html>